<template>
	<view style="padding: 10px">
		<!-- <image class="logo" src="/static/logo.png"></image> -->
		<uni-section title="TPM" class="mb-10" type="line"> </uni-section>
		<view class="uni-card">
			<uni-grid
				:column="3"
				:show-border="false"
				:square="false"
				@change="gridChange"
			>
				<uni-grid-item
					v-for="(item, index) in posList"
					:index="index"
					:key="index"
				>
					<view class="grid-item-box">
						<image
							class="image"
							:src="item.url"
							mode="aspectFill"
						/>
						<text class="text">{{ item.text }}</text>
						<view v-if="item.badge" class="grid-dot">
							<uni-badge :text="item.badge" :type="item.type" />
						</view>
					</view>
				</uni-grid-item>
			</uni-grid>
			<!-- 提示窗示例 -->
			<uni-popup
				ref="alertDialog"
				type="dialog"
				:mask-background-color="maskColor"
			>
				<uni-popup-dialog
					type="warn"
					cancelText="取消"
					confirmText="确定"
					title="导出功能优化中,暂时无法使用!"
					@confirm="dialogConfirm"
					@close="dialogClose"
				>
					<view style="width: 100%">
						<!-- <uni-data-checkbox multiple v-model="checkShop" :localdata="ShopOption"></uni-data-checkbox> -->
						<!-- <uni-data-select
								class="dialog-select"
							    v-model="areaId"
							    :localdata="spaceOption"
								:clear="false"
								label="应用选择"
								placeholder="请选择转交区域"
							></uni-data-select> -->
					</view>
					<!-- <uni-forms>
							<uni-forms-item label="转交区域:" name="workshopareaId">
								
							</uni-forms-item>
						</uni-forms> -->
				</uni-popup-dialog>
			</uni-popup>
		</view>
		<uni-section title="自主保全" class="mb-10" type="line"> </uni-section>
		<view class="uni-card">
			<uni-grid
				:column="2"
				:show-border="false"
				:square="false"
				@change="bqcheckChange"
			>
				<uni-grid-item
					v-for="(item, index) in bqList"
					:index="index"
					:key="index"
				>
					<view class="grid-item-box">
						<image
							class="image"
							:src="item.url"
							mode="aspectFill"
						/>
						<text class="text">{{ item.text }}</text>
						<view v-if="item.badge" class="grid-dot">
							<uni-badge :text="item.badge" :type="item.type" />
						</view>
					</view>
				</uni-grid-item>
			</uni-grid>
		</view>
		<uni-section title="专业保全" class="mb-10" type="line"> </uni-section>
		<view class="uni-card">
			<uni-grid
				:column="2"
				:show-border="false"
				:square="false"
				@change="checkChange"
			>
				<uni-grid-item
					v-for="(item, index) in djList"
					:index="index"
					:key="index"
				>
					<view class="grid-item-box">
						<image
							class="image"
							:src="item.url"
							mode="aspectFill"
						/>
						<text class="text">{{ item.text }}</text>
						<view v-if="item.badge" class="grid-dot">
							<uni-badge :text="item.badge" :type="item.type" />
						</view>
					</view>
				</uni-grid-item>
			</uni-grid>
		</view>
	</view>
</template>

<script>
import { post, postForm } from '../../utils/request.js';
export default {
	data() {
		return {
			maskColor: 'rgba(0, 0, 0, 0.4)',
			posList: [
				{
					url: '/static/posInsert.svg',
					text: '排查问题',
				},
				{
					url: '/static/handel.svg',
					text: '处理问题',
					badge: '1',
					type: 'warning',
				},
				{
					url: '/static/allPos.svg',
					text: '全部问题',
					badge: '99',
					type: 'primary',
				},
				/* {
					url: '/static/export1.svg',
					text: '导出',
				}, */
				{
					url: '/static/alert.svg',
					badge: '0',
					type: 'primary',
					text: '闭环通知',
				},
				{
					url: '/static/rectfy.svg',
					badge: '0',
					type: 'warning',
					text: '整改通知',
				},
			],
			bqList: [
				/* {
					url: '/static/kanban.svg',
					text: '设备功能管理看板',
					path: '/pages/KanBan/shebei/index',
				}, */
				{
					url: '/static/gnCheck.svg',
					text: '设备功能管理',
					path: '/pages/gnCheck/index',
				},
				{
					url: '/static/jdCheck.svg',
					text: '设备精度(生产)',
					path: '/pages/jdscCheck/index',
				},
				],
			djList: [
				/* {
					url: '/static/kanban.svg',
					text: '设备功能得分看板',
					path: '/pages/KanBan/sbDeFen/index',
				}, */
				{
					url: '/static/jdCheck.svg',
					text: '设备精度(设备)',
					path: '/pages/jdCheck/index',
				},
				{
					url: '/static/proImg.svg',
					text: '设备点检',
					path: '/pages/deviceCheck/index',
				},
				/* {
					url: '/static/more1.png',
					text: '更多',
				}, */
			],
			userInfor: uni.getStorageSync('userInfor'),
			checkShop: [],
			ShopOption: [],
			isDerive: '',
			isRectify: '',
		};
	},

	onShow() {
		this.userInfor = uni.getStorageSync('userInfor');
		this.isDerive = this.userInfor.isDerive;
		this.isRectify = this.userInfor.isRectify;
		this.getAll();
		this.getAlert();
	},
	onLoad() {},
	methods: {
		getAll() {
			let id = this.userInfor.userId;
			// 获取待处理问题总数
			post('/problem/getWaitCount?userId=' + id)
				.then((data) => {
					if (data.data != 'fail') {
						this.posList[1].badge = data.data + '';
						console.log(
							this.posList[1].badge,
							'this.posList[1].badge',
						);
					} else {
						uni.showToast({
							icon: 'none',
							title: data.message,
						});
					}
				})
				.catch((err) => {
					uni.showToast({
						icon: 'none',
						title: '查询失败，请检查接口返回',
					});
				});
			// 获取问题总数
			post('/problem/getAllCount?userId=' + id)
				.then((data) => {
					if (data.data != 'fail') {
						console.log(data,'data');
						this.posList[2].badge = data.data + '';
					} else {
						uni.showToast({
							icon: 'none',
							title: data.message,
						});
					}
				})
				.catch((err) => {
					uni.showToast({
						icon: 'none',
						title: '查询失败，请检查接口返回',
					});
				});
			//获取车间
			let shop = this.userInfor.workshopList;
			let shopData = [];
			for (var i = 0; i < shop.length; i++) {
				shopData[i] = {};
				shopData[i].value = shop[i].id;
				shopData[i].text = shop[i].workshopName;
			}
			this.ShopOption = shopData;
		},
		getAlert() {
			let id = this.userInfor.userId;
			let prame = {
				userId: id,
			};
			post('/problem/rectifyInform', prame)
				.then((data) => {
					if (data.code == 200) {
						if (data.data == null) {
							this.posList[4].badge = '0';
							//uni.setStorageSync('rectifyData', data.data);
						} else {
							this.posList[4].badge = data.message + '';
							//uni.setStorageSync('rectifyData', data.data);
						}
					} else {
						uni.showToast({
							icon: 'none',
							title: data.message,
						});
					}
				})
				.catch((err) => {
					uni.showToast({
						icon: 'none',
						title: '获取数据失败，请检查接口返回',
					});
				});
			post('/problem/successInform', prame)
				.then((data) => {
					if (data.code == 200) {
						this.posList[3].badge = data.message + '';
						//uni.setStorageSync('successData', data.data);
					} else {
						uni.showToast({
							icon: 'none',
							title: data.message,
						});
					}
				})
				.catch((err) => {
					uni.showToast({
						icon: 'none',
						title: '获取数据失败，请检查接口返回',
					});
				});
		},
		gridChange(e) {
			let data = e.detail.index;
			console.log(data, 'data');
			if (data == 0) {
				uni.$emit('switchTabData', { id: 1 });
				uni.switchTab({
					url: '/pages/index/index',
				});
			} else if (data == 1) {
				if (this.isRectify) {
					uni.$emit('switchTabData', { id: 1 });
					uni.navigateTo({
						url: '/pages/position/handel/index',
					});
				} else {
					uni.showToast({
						icon: 'none',
						title: '该用户没有处理权限！',
					});
				}
			} else if (data == 2) {
				uni.$emit('switchTabData', { id: 1 });
				uni.navigateTo({
					url: '/pages/position/posAll/index',
				});
			}  else if (data == 3) {
				uni.navigateTo({
					url: '/pages/notice/successInform',
				});
			} else if (data == 4) {
				if (this.isRectify) {
					uni.navigateTo({
						url: '/pages/notice/rectifyInform',
					});
				} else {
					uni.showToast({
						icon: 'none',
						title: '该用户没有整改权限！',
					});
				}
			}
		},
		bqcheckChange(e) {
			const index = e.detail.index;
			const path = this.bqList[index].path;
			if (!path) {
				return;
			}
			uni.navigateTo({
				url: path,
			});
		},
		checkChange(e) {
			const index = e.detail.index;
			const path = this.djList[index].path;
			if (!path) {
				return;
			}
			uni.navigateTo({
				url: path,
			});
		},
		dialogConfirm() {
			this.dialogClose();
		},

		dialogClose() {
			console.log('点击关闭');
		},
		exportExcle() {
			// 显示加载提示
			uni.showLoading({
				title: '正在导出...',
			});
			let checkShop = this.checkShop;
			console.log(checkShop, 'checkShop');
			// 发送 POST 请求
			uni.request({
				url:
					'https://www.shagangtpm.cn/prod/problem/derive?worksopIds=' +
					checkShop, // 接口地址
				method: 'POST', // 设置为 POST 请求
				data: {
					// 如果接口需要参数，在此添加，例如：
					// param1: 'value1'
				},
				responseType: 'arraybuffer', // 处理二进制文件流
				success: (res) => {
					if (res.statusCode === 200) {
						// 从响应头中提取文件名
						const disposition =
							res.header['content-disposition'] ||
							res.header['Content-Disposition'];
						let fileName = 'export.xlsx'; // 默认文件名
						if (disposition) {
							const matches = disposition.match(/filename=(.*)/);
							if (matches && matches[1]) {
								fileName = decodeURIComponent(matches[1]); // 解码文件名
							}
						}

						// 保存文件到本地
						const fs = uni.getFileSystemManager();
						const filePath = `${wx.env.USER_DATA_PATH}/${fileName}`;
						fs.writeFile({
							filePath: filePath,
							data: res.data,
							encoding: 'binary',
							success: () => {
								uni.hideLoading();
								//  uni.saveFile({
								//       tempFilePath: filePath,
								//       success: function (res) {
								//       var savedFilePath = res.savedFilePath;
								// console.log(savedFilePath, '保存成功了')
								//       }
								//   });
								//                          uni.showToast({
								//                              title: '导出成功',
								//                              icon: 'success',
								//                          });
								// 可选：打开文件
								uni.openDocument({
									filePath: filePath,
									showMenu: true,
									fileType: 'xlsx',
									fail: (err) => {
										console.log('打开文档失败', err);
										uni.showToast({
											title: '打开文档失败',
											icon: 'fail',
										});
									},
								});
							},
							fail: (err) => {
								uni.hideLoading();
								uni.showToast({
									icon: 'none',
									title: '保存文件失败',
								});
								console.log('保存文件失败', err);
							},
						});
					} else {
						uni.hideLoading();
						uni.showToast({
							icon: 'none',
							title: '导出失败，请重试',
						});
					}
				},
				fail: (err) => {
					uni.hideLoading();
					uni.showToast({
						icon: 'none',
						title: '请求失败，请检查网络',
					});
					console.log('请求失败', err);
				},
			});
		},
	},
};
</script>

<style>
.uni-badge {
	display: flex;
	overflow: hidden;
	box-sizing: border-box;
	-webkit-font-feature-settings: 'tnum';
	font-feature-settings: 'tnum';
	min-width: 20px;
	justify-content: center;
	flex-direction: row;
	height: 20px;
	padding: 0 4px;
	line-height: 18px;
	color: #fff;
	border-radius: 100px;
	background-color: #909399;
	background-color: transparent;
	border: 1px solid #fff;
	text-align: center;
	font-family: 'Helvetica Neue', Helvetica, sans-serif;
	font-size: 12px;
}
.uni-section {
	background-color: rgba(237, 237, 237, 0.9) !important;
}
.uni-section .uni-section-header__content .distraction {
	color: #2979ff !important;
	font-size: 16px !important;
	font-weight: 600 !important;
}
.uni-card {
	background-color: #fff;
	border-radius: 10px;
}
.mb-10 {
}
.uni-section-content {
	padding: 0px;
}
.image {
	width: 25px;
	height: 25px;
}
.text {
	font-size: 14px;
	margin-top: 5px;
}
.example-body {
	/* #ifndef APP-NVUE */
	// display: block;
	/* #endif */
}
.grid-dynamic-box {
	margin-bottom: 15px;
}
.grid-item-box {
	flex: 1;
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 20px 0;
}
.grid-item-box-row {
	flex: 1;
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
	align-items: center;
	justify-content: center;
	padding: 15px 0;
}
.grid-dot {
	position: absolute;
	top: 5px;
	right: 15px;
}
.swiper {
	height: 420px;
} /* 全局样式或当前页面的样式 */
.uni-popup__mask {
	background-color: rgba(0, 0, 0, 0.4) !important; /* 强制覆盖 */
}
/* 确保弹框居中 */
.uni-popup-dialog {
	box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 3px 1px;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
</style>
